<template>
  <div>
    <el-table :show-header="false"
        highlight-current-row
        @current-change="handleCurrentChange"
        :data="data">
      <el-table-column label="名字" align="left" prop="name" />
    </el-table>

    <el-table :data="indexItemList" default-expand-all height="400px" row-key="id">
      <el-table-column label="检查指标" align="left" prop="indexName" />
      <el-table-column label="检查指标项" align="left" prop="name" />
      <el-table-column label="检查要点" align="left" prop="spec" />
      <el-table-column label="检查状态" align="center" width="60">
        <template slot-scope="scope">
          <el-switch
            v-if="scope.row.indexId"
            v-model="scope.row.checkedStatus"
            :active-value=1
            :inactive-value=0
            @change="handleCheckedChange(scope.row)"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column label="存在隐患" align="center">
        <template slot-scope="scope">
          <el-switch
            v-if="scope.row.indexId"
            v-model="scope.row.hiddenDanger"
            :active-value=1
            :inactive-value=0
            @change="handleHiddenDangerChange(scope.row)"
          ></el-switch>
        </template>
      </el-table-column>
      <el-table-column label="操作" align="center"  width="50">
        <template slot-scope="scope">
          <el-button
            v-if="scope.row.indexId"
            style="text-decoration: underline;"
            size="mini"
            type="text"
            @click="handleManage(scope.row)"
          >添加</el-button>
        </template>
      </el-table-column>
    </el-table>
  </div>
</template>

<script>
import { updateItemHiddenDanger, getTreeTableInfo, listTaskItem } from "@/api/labsafety/taskItem";
export default {
  name: "TargetItem",
  props: {
    data: Array,
    instanceId: Number
  },
  data() {
    return {
      total: 0,
      currentRow: null,
      queryParams: {
        pageNum: 1,
        pageSize: 10,
        indexId: null,
        instanceId: null
      },
      indexItemList: []
    };
  },
  created() {
  },
  methods: {
    handleCurrentChange(val) {
      listTaskItem({indexId: row.id, instanceId: this.instanceId}).then(response => {
        this.indexItemList = response.rows
      })
    },
    handleHiddenDangerChange(row) {
      if(!row){
        return;
      }
      const data = {
        id: row.id,
        hiddenDanger: row.hiddenDanger
      }
      updateItemHiddenDanger(data).then(response => {
      })
    },
    handleManage(row) {

    }
  }
};
</script>

<style scoped lang="scss">
/* 去掉中间数据的分割线 */
/deep/ .el-table__row > td {
  border: none;
}
/* 去掉上面的线 */
/* .el-table th.is-leaf{
        border: none;
    } */
/* 去掉最下面的那一条线 */
/deep/ .el-table::before {
  height: 0px;
}
/deep/ .el-table .cell {
  line-height: 23px;
}
</style>
